<template>
	<view>
		<view class="header" :style="{'height':statusBarHeight+'px'}">
			<view class="navon" :style="{'height':statusBarHeight+'px','padding-top':statusBarHeight1+'px'}">
				<view class="hearder-content">
					工作台
				</view>
			</view>
		</view>
		<view class="content" :style="{'paddingTop':statusBarHeight+'px'}">
			<view class="content-bg">
				<view class="" style="display: flex;justify-content: space-between;align-items: center; ">
					<view class="title" @click="toggleDropdown">
						{{ selectedOption }}<u-icon name="arrow-down" size="22rpx" color="#ffffff"></u-icon>
					</view>

					<view class="addressTitle" v-if="selectedOption == '达人工作台'">
						<view class="" style="display: flex;">
							<view class="">
								地址：
							</view>
							<view class="refreshAddress">
								{{address?address:''}}
							</view>
						</view>
						<view class="" @click="getAddress">
							<image style="width: 24rpx;height: 24rpx;display: block;"
								src="https://pw.qyang.cc/static/refresh.png" mode=""></image>
						</view>
					</view>
				</view>
				<view v-if="isDropdownShow" class="dropdown">
					<view class="dropdownTxt" v-for="(option, index) in options" :key="index" :value="option"
						@click="selectOption(option)">
						{{ option }}
					</view>
				</view>
				<view class="number">
					<view class="number-box" v-if="selectedOption == '城市合伙人'">
						<view class="number-item">
							<view class="number-num">
								{{agent.user_count?agent.user_count:0}}
							</view>
							用户量
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.agent_count?agent.agent_count:0}}
							</view>
							达人数
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.activity_count?agent.activity_count:0}}
							</view>
							活动数
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.post_count?agent.post_count:0}}
							</view>
							帖子数
						</view>
					</view>
					<view class="number-box" v-if="selectedOption == '城市合伙人'">
						<view class="number-item">
							<view class="number-num">
								{{agent.month_order?agent.month_order:0}}
							</view>
							月订单
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.total_order?agent.total_order:0}}
							</view>
							总订单
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.month_income?agent.month_income:'0.00'}}
							</view>
							月收益
						</view>
						<view class="number-item">
							<view class="number-num">
								{{agent.total_income?agent.total_income:'0.00'}}
							</view>
							总收益
						</view>
					</view>
					<view class="number-box" v-if="selectedOption == '达人工作台'">
						<view class="number-item">
							<view class="number-num">
								{{info.order_num?info.order_num:0}}
							</view>
							月订单
						</view>
						<view class="number-item">
							<view class="number-num">
								{{info.order_num_all?info.order_num_all:0}}
							</view>
							总订单
						</view>
						<view class="number-item">
							<view class="number-num">
								{{info.inc?info.inc:'0.00'}}
							</view>
							月收益
						</view>
						<view class="number-item">
							<view class="number-num">
								{{info.inc_all?info.inc_all:'0.00'}}
							</view>
							总收益
						</view>
						<view @click="changeStatus" class="lineStatus" v-if="selectedOption == '达人工作台'">
							<image :src="selectedImage" mode=""></image>
							<view class="" style="text-align: center;margin-top: 10rpx;">
								{{selectedTxt}}
							</view>
						</view>
					</view>
				</view>
				<view class="" style="color: #fff;font-size: 24rpx;margin-left: 20rpx;"
					v-if="selectedOption == '达人工作台'">
					本月<span>{{info.city_name}}</span>排名
					<span style="margin: 10rpx;font-size: 36rpx;color: #BBE3C0;	">
						{{info.ranking}}
					</span>位
				</view>
				<view class="snapupOrder" v-if="selectedOption == '达人工作台'">
					<view class="snapupOrderCenter" @click="snapupOrder">
						抢单大厅
					</view>
					<view class="snapupOrderList" @click="snapupOrder">

						<swiper class="swiper" vertical="true" loop="true" :interval="2000" disable-touch circular
							autoplay="true" :indicator-dots="false">
							<swiper-item style="display: flex;" v-for="(item,index) in snapupOrdersList" :key="index">
								<view class="date">
									{{item.timess?item.timess:''}}
								</view>
								<view class="date">
									{{item.name?item.name:''}}
								</view>
								<view class="date">
									{{item.times?item.times+'小时':0+'小时'}}
								</view>
								<view class="date" style="color: #FF7681;">
									{{item.money?item.money:'0.00'}}元
								</view>
							</swiper-item>
						</swiper>

						<view class="icon">
							<u-icon name="arrow-right"></u-icon>
						</view>
					</view>
					<view class="" style="margin-left: 20rpx;" @click="serviveSet">
						<image src="https://pw.qyang.cc/static/set1.png" mode=""
							style="width: 42rpx;height: 42rpx;display: block;">
						</image>
					</view>
				</view>
				<view class="area" v-if="selectedOption == '城市合伙人'">
					负责区域
					<view class="area-text">
						{{agent.city_name?agent.city_name:''}}
					</view>
				</view>
			</view>
		</view>
		<view class="tab-btn" v-if="selectedOption == '城市合伙人'">
			<view class="btn1" @click="goPage('memberManage/memberManage')">
				<image src="https://pw.qyang.cc/static/svg/city-icon-1.svg" mode="aspectFit"></image>
				成员管理
			</view>
			<view class="btn1" @click="goPage('square/square')">
				<image src="https://pw.qyang.cc/static/svg/city-icon-2.svg" mode="aspectFit"></image>
				帖子管理
			</view>
			<view class="btn1" @click="goPage('activityManage/activityManage')">
				<image src="https://pw.qyang.cc/static/svg/city-icon-3.png" mode="aspectFit"></image>
				活动管理
			</view>
			<view class="btn1" @click="goPage('proxyManage/proxyManage')">
				<image src="https://pw.qyang.cc/static/svg/city-icon-4.svg" mode="aspectFit"></image>
				代理设置
			</view>
		</view>
		<!-- <view class="tab-btn" v-if="selectedOption == '城市合伙人'">
			<view class="btn1" @click="goPage('memberManage/memberManage')">
				<image src="https://pw.qyang.cc/static/icon-m1.png" mode=""></image>
				成员管理
			</view>
			<view class="btn1" @click="goPage('square/square')">
				<image src="https://pw.qyang.cc/static/icon-m2.png" mode=""></image>
				帖子管理
			</view>
			<view class="btn1" @click="goPage('activityManage/activityManage')">
				<image src="https://pw.qyang.cc/static/icon-m3.png" mode=""></image>
				活动管理
			</view>
			<view class="btn1" @click="goPage('proxyManage/proxyManage')">
				<image src="https://pw.qyang.cc/static/icon-m4.png" mode=""></image>
				代理设置
			</view>
		</view> -->
		<view class="tabs">
			<view class="tabs-1" v-if="selectedOption == '城市合伙人'">
				<view v-for="(item, index) in tablist" :key="index" class="tabs-2"
					:class="{ 'active': isSelected === index }" @click="selectTab(index)">
					{{ item.name }}
				</view>
				<i @click="handlefilter" class="iconfont tabs-icon" size="18">&#xe888;</i>
			</view>
			<u-tabs @click="clickService" v-if="selectedOption == '城市合伙人'&&isSelected==0" :list="tablist1"
				:current="isSelected1" lineWidth="30" lineColor="#f56c6c" keyName="name" :activeStyle="{
			    color: '#303133',
			    fontWeight: 'bold',
			    transform: 'scale(1.05)'
			}" :inactiveStyle="{
			    color: '#606266',
			    transform: 'scale(1)'
			}" itemStyle="padding:0 40rpx; height: 34px;">
			</u-tabs>
			<u-tabs @click="clickActivity" v-if="isSelected==1" :list="tablist2" lineWidth="30" lineColor="#f56c6c"
				keyName="name" :activeStyle="{
			    color: '#303133',
			    fontWeight: 'bold',
			    transform: 'scale(1.05)'
			}" :inactiveStyle="{
			    color: '#606266',
			    transform: 'scale(1)'
			}" itemStyle="padding:0 40rpx; height: 34px;">
			</u-tabs>
		</view>
		<view class="content-order" v-if="selectedOption == '城市合伙人'">
			<view v-if="isSelected==0" class="orderList" v-for="(item,index) in orderList"
				@click="handleOrderDetail(item)">
				<view class="con2">
					<view class="l1">
						<image style="width: 26px;height: 26px;border-radius:50%;margin: 0 20rpx;"
							:src="item.daren_avatar" mode="aspectFill"></image>
						{{item.daren_nickname}}
						<image src="https://pw.qyang.cc/static/svg/icon-realname.svg" v-if="item.daren_is_real"
							style="width: 30rpx;height: 30rpx;margin-left:20rpx;">
						</image>
						<view class="l1-sex1" v-if="item.daren_gender == 1">
							<image src="https://pw.qyang.cc/static/sexW.png"
								style="width: 20rpx;height: 20rpx;margin-right: 10rpx;">
							</image>{{item.daren_age}}
						</view>
						<view class="l1-sex2" v-if="item.daren_gender == 0">
							<image src="https://pw.qyang.cc/static/sexM.png"
								style="width: 20rpx;height: 20rpx; margin-right: 10rpx;">
							</image>{{item.daren_age}}
						</view>
					</view>
				</view>
				<view class="status">
					<view class="status status0" v-if="item.status == 100">
						{{item.status_texts}}
					</view>
					<view class="status status1" v-if="item.status == 0">
						{{item.status_texts}}
					</view>
					<view class="status status2" v-if="item.status == 1">
						{{item.status_texts}}
					</view>
					<view class="status status3" v-if="item.status == 2">
						{{item.status_texts}}
					</view>
					<view class="status status4" v-if="item.status == 3 || item.status == 4 || item.status == 5 ">
						{{item.status_texts}}
					</view>
					<view class="status status5" v-if="item.status == 6">
						{{item.status_texts}}
					</view>
					<view class="status status6" v-if="item.status == '-1'">
						{{item.status_texts}}
					</view>
				</view>
				<view class="con5" v-if="item.status==1||item.status==2">
					<view class="con5-1">
						<i class="iconfont" style="font-style:normal;margin-right: 10rpx;">&#xe65f;</i>
						剩余时间{{item.excessTime}}
					</view>
					<view class="con5-2" v-if="item.status==1">
						30分钟内，达人未接单，订单将自动取消
					</view>
					<view class="con5-2" v-if="item.status==2">
						30分钟内，未选择达人，系统将自动为你匹配
					</view>
				</view>
				<view class="con1">
					<view class="con1-item">
						<image src="https://pw.qyang.cc/static/svg/order-icon-0.svg" mode=""></image>
						<view>{{item.title}}</view>
					</view>
					<view class="con1-item">
						<image src="https://pw.qyang.cc/static/svg/biao.svg" mode=""></image>
						<view>{{item.time_text}}</view>
					</view>
					<view class="con1-item">
						<image src="https://pw.qyang.cc/static/svg/dingwei.svg" mode=""></image>
						<view>{{item.address}}</view>
					</view>
					<view class="con1-item" v-if="item.type == 0">
						<image src="https://pw.qyang.cc/static/svg/order-icon-3.svg" mode=""></image>
						<view>{{item.level_title}}</view>

					</view>
					<!-- <view class="con1-item">
						<image src="https://pw.qyang.cc/static/svg/order-icon-3.svg" mode=""></image> 不指定区域
					</view> -->
				</view>
				<view class="con3">
					<view style="display: flex;align-items: center;">
						{{item.total_price}}元
						<span class="con3-text">
							（服务费:
							<span class="money">{{item.price}}元 </span>
							路费:
							<span class="money">{{item.address_price}}元
							</span>）
						</span>
					</view>
				</view>
			</view>
			<view v-if="isSelected==1" class="activityList" v-for="(item,index) in activeList" :key="index"
				@click="handleActivityDetail(item)">
				<view class="title">
					<view class="title-text">
						{{item.title}}
					</view>
				</view>
				<view class="status">
					<view class="status status0" v-if="item.status == 0">
						筹备中
					</view>
					<view class="status status1" v-if="item.status == 1">
						报名中
					</view>
					<view class="status status2" v-if="item.status == 2">
						已结束
					</view>
				</view>
				<view class="image">
					<image :src="rq.imgUrl(item.image.split(',')[0])" mode="aspectFill"></image>
					<view class="endtimes"
						v-if="(item.activity_status == 1||item.activity_status == 2)&&item.exam_status == 2">
						剩余显示时长:{{item.diffindays}}天
					</view>
				</view>
				<view class="con">
					<view class="con1">
						<image src="https://pw.qyang.cc/static/svg/biao.svg" mode="aspectFill"
							style="width: 30rpx;height: 30rpx;margin-right: 15rpx;"></image>
						{{ item.issue }}
					</view>
					<view class="con1">
						<image src="https://pw.qyang.cc/static/svg/dingwei.svg" mode="aspectFit"
							style="width: 30rpx;height: 30rpx;margin-right: 15rpx;"></image>{{ item.address }}
					</view>
					<view class="con1 con2" v-if="item.activity_status == 1">
						<view class="con2-img">
							<image v-for="i,a in item.join_avatar" :key="a" :src="rq.imgUrl(i)" mode=""></image>
						</view>
						<view class="con2-text">
							累计 <span style="color: #FF7883;">{{ item.join_num }}人</span> 报名
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 服务订单的筛选 -->
		<u-popup :show="show1" :round="10" mode="bottom" closeable @close="show1=false" @open="show1=true">
			<view class="pop-content">
				<view class="title">
					筛选项
				</view>
				<view class="title-1">
					服务名
					<input class="input" type="text" placeholder="请输入" v-model="seviceParams.text" />
				</view>

				<view class="title-1">
					指定达人
					<input class="input" type="text" placeholder="请输入达人昵称" v-model="seviceParams.daren_name" />
				</view>

				<view class="title-1">
					指定用户
					<input class="input" type="text" placeholder="请输入用户昵称" v-model="seviceParams.user_name" />
				</view>
				<view class="title-1">
					订单状态
					<view class="status">
						<view class="status-item" v-for="(i,index) in tablist1" :key="index"
							:class="{ 'active': isSelected1 === index }" @click="selectTab1(index)">
							{{i.name}}
						</view>
					</view>
				</view>
				<view class="title-1">
					下单时间
					<view class="time">
						<view class="time1 mr" @click="showTime1=true">
							<view v-if="!start_time">
								开始日期
							</view>
							<view v-else>
								{{formatDate(start_time)}}
							</view>
						</view>
						<view class="time1" @click="showTime2=true">
							<view v-if="!end_time">
								结束日期
							</view>
							<view v-else>
								{{formatDate(end_time)}}
							</view>
						</view>
						<u-datetime-picker :show="showTime1" v-model="value1" mode="date"
							@confirm="choosetime1"></u-datetime-picker>
						<u-datetime-picker :show="showTime2" v-model="value1" mode="date"
							@confirm="choosetime2"></u-datetime-picker>
					</view>
				</view>
				<view class="pop-bottom">
					<view class="btn1" @click="reset">
						重置
					</view>
					<view class="btn2" @click="confirmfilter">
						确认
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 活动的筛选 -->
		<u-popup :show="show2" :round="10" mode="bottom" closeable @close="show2=false" @open="show2=true">
			<view class="pop-content">
				<view class="title">
					筛选项
				</view>
				<view class="title-1">
					活动名称
					<input class="input" type="text" placeholder="请输入" v-model="activeParams.title" />
				</view>
				<view class="title-1">
					发布者
					<input class="input" type="text" placeholder="请输入" v-model="activeParams.user_name" />
				</view>
				<view class="title-1">
					报名时间
					<view class="time">
						<view class="time1" @click="showTime1=true">
							<view v-if="!start_time">
								开始日期
							</view>
							<view v-else>
								{{formatDate(start_time)}}
							</view>
						</view>
						<view class="time1" @click="showTime2=true">
							<view v-if="!end_time">
								结束日期
							</view>
							<view v-else>
								{{formatDate(end_time)}}
							</view>
						</view>
						<u-datetime-picker :show="showTime1" v-model="value1" mode="date"
							@confirm="choosetime1"></u-datetime-picker>
						<u-datetime-picker :show="showTime2" v-model="value1" mode="date"
							@confirm="choosetime2"></u-datetime-picker>
					</view>
				</view>
				<view class="pop-bottom">
					<view class="btn1" @click="reset1">
						重置
					</view>
					<view class="btn2" @click="confirmfilter1">
						确认
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 达人工作台 -->
		<view v-if="selectedOption == '达人工作台'" class="daren_con">
			<expertsWork style="width: 100%;"></expertsWork>
		</view>

		<view>
			<u-picker :show="show" :columns="columns" @confirm="handlePickerConfirm" @cancel="show=false"></u-picker>
		</view>
		<u-popup :show="showActivityDetail" :round="10" mode="bottom" closeable @close="showActivityDetail=false"
			@open="showActivityDetail=true">
			<view class="pop-content-detail">
				<view class="content-title">
					活动详情
				</view>
				<view class="content-detail">
					<activityDetail :activityId="activityId" />
				</view>
			</view>
		</u-popup>
		<!-- 从派单下单 -->
		<u-popup :show="showOrderDetail" :round="10" mode="bottom" closeable @close="showOrderDetail=false"
			@open="showOrderDetail=true">
			<view class="pop-content-detail">
				<view class="content-title">
					订单详情
				</view>
				<view class="content-detail">
					<orderDetail :orderId="orderId" :orderInfo="orderInfo" :orderStatus="orderStatus"></orderDetail>
				</view>
			</view>
		</u-popup>
		<!-- 从达人下单 -->
		<u-popup :show="showOrderDetail1" :round="10" mode="bottom" closeable @close="showOrderDetail1=false"
			@open="showOrderDetail1=true">
			<view class="pop-content-detail">
				<view class="content-title">
					订单详情
				</view>
				<view class="content-detail">
					<orderDetailTalent :orderId="orderId" :orderInfo="orderInfo" :orderStatus="orderStatus">
					</orderDetailTalent>
				</view>
			</view>
		</u-popup>
		<view style="height: 110rpx;width: 100%;"></view>
		<view class="bottom-tabbar">
			<tabbar :currentPage="2" />
		</view>
	</view>
</template>

<script>
	import index from '../../uni_modules/uview-ui';
	import expertsWork from '../../components/expertswork/expertswork.vue'
	export default {
		components: {
			expertsWork
		},
		data() {
			return {
				activityId: '',
				selectedImage: 'https://pw.qyang.cc/static/online.png',
				selectedTxt: '在线',
				show: false,
				columns: [
					['在线', '隐身']
				],
				options: ['城市合伙人', '达人工作台'],
				isDropdownShow: false,
				selectedOption: '城市合伙人',
				snapupOrdersList: [],
				orderId: '',
				orderStatus: '',
				orderInfo: {},
				statusBarHeight: 0,
				statusBarHeight1: 0,
				isSelected: 0,
				isSelected1: 0,
				isSelected2: null,
				show1: false,
				show2: false,
				showActivityDetail: false,
				showOrderDetail: false,
				showOrderDetail1: false,
				showTime1: false,
				showTime2: false,
				start_time: '',
				end_time: '',
				value1: Number(new Date()),
				tablist: [{
					name: '服务订单'
				}, {
					name: '活动订单'
				}],
				tablist2: [{
					id: null,
					name: '全部'
				}, {
					id: 2,
					name: '报名中'
				}, {
					id: 3,
					name: '已结束'
				}],
				tablist1: [{
						name: '全部',
						array: [],
					}, {
						name: '待付款',
						array: [0],
					}, {
						name: '待接单',
						array: [1],
					},
					{
						name: '选达人',
						array: [2],
					}, {
						name: '已接单',
						array: [3, 4, 5],
					}, {
						name: '服务中',
						array: [6],
					},
					{
						name: '已完成',
						array: [100],
					}, {
						name: '已取消',
						array: [-1],
					}
				],
				orderList: [],
				activeList: [],
				//城市代理信息
				agent: {},
				activeParams: {
					page: 1
				},
				seviceParams: {
					page: 1,
					type: 'daili',
					city_ids: [],
					daren_name: '',
					user_name: ''
				},
				total: 0,
				info: {},
				address: '',
				timer: null,
				animateUp: false
			};
		},
		onPullDownRefresh() {
			let role = JSON.parse(uni.getStorageSync('userInfo')).group_id
			if (role == 3) {
				if (this.isSelected == 0) {
					this.seviceParams.page = 1
					this.getSeviceOrder()
				} else {
					this.activeParams.page = 1
					this.getActiveOrder()
				}
			}
			uni.hideNavigationBarLoading()
		},
		onReachBottom() {
			let role = JSON.parse(uni.getStorageSync('userInfo')).group_id
			console.log(role, this.isSelected)
			if (role == 3) {
				if (this.isSelected == 0) {
					if (this.orderList.length < this.total) {
						this.seviceParams.page++
						this.getSeviceOrder(true)
					}
				} else {
					if (this.activeList.length < this.total) {
						this.activeParams.page++
						this.getActiveOrder(true)
					}
				}
			}
		},
		onShow() {
			let role = JSON.parse(uni.getStorageSync('userInfo')).group_id
			if (role == 2) {
				let dw = uni.getStorageSync('dw')
				this.getQdList({
					city_id: dw.id
				})
			
				setTimeout(()=>{
					uni.$emit('update')
				},100)
			}
		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => {
					// 假设自定义导航包含状态栏高度以及额外设置的导航栏部分高度（比如44px，具体根据实际样式设定）
					this.statusBarHeight = res.statusBarHeight * 1 + 46;
					this.statusBarHeight1 = res.statusBarHeight;
				},
			});
			let role = JSON.parse(uni.getStorageSync('userInfo')).group_id //group_id=1普通2达人3城市代理
			let dw = uni.getStorageSync('dw')

			if (role == 3) { //城市代理
				this.selectedOption = '城市合伙人'
				this.options = ['城市合伙人']
				this.rq.getData('agent/index').then(res => {
					this.agent = res.data
					this.seviceParams.city_ids = res.data.city_array
					this.getSeviceOrder()
				})

			} else if (role == 2) { //达人工作台
				this.selectedOption = '达人工作台'
				this.options = ['达人工作台']
				this.rq.getData('daren/daren_statistics').then(res => {
					this.info = res.data
					let imagePath = '';
					let imageTxt = ''
					switch (this.info.online) {
						case '1':
							imagePath = 'https://pw.qyang.cc/static/online.png';
							imageTxt = '在线';
							break;
						case '3':
							imagePath = 'https://pw.qyang.cc/static/offline.png';
							imageTxt = '隐身';
							break;
						default:
							imagePath = 'https://pw.qyang.cc/static/online.png'; // 如果出现其他未预期的选项，设置一个默认图片路径
							imageTxt = '在线';
					}
					this.selectedImage = imagePath;
					this.selectedTxt = imageTxt;
				})
				this.getAddress()

			} else {
				this.selectedOption = ''
				this.options = []
			}
		},
		onUnload() {
			clearInterval()
		},
		methods: {
			getQdList(params) {
				this.rq.getData('daren/grab_index', params).then(res => {
					this.snapupOrdersList = res.data
				})
			},
			getAddress() {
				let that = this
				uni.getLocation({
					type: 'gcj02',
					isHighAccuracy: true,
					success: r => {
						that.rq.getData('daren/getAddress', {
							lng: r.longitude,
							lat: r.latitude
						}).then(res => {
							if (res.code == 1) {
								that.address = res.data.address
							}
						})
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {}
				});
			},
			serviveSet() {
				uni.navigateTo({
					url: '/pages/workbench/serviceset'
				})
			},
			getSeviceOrder(more) {
				this.rq.getData('order/getOrderList', this.seviceParams).then(res => {
					this.orderList = more ? [...this.orderList, ...res.data.data] : res.data.data
					this.total = res.data.total
					uni.stopPullDownRefresh()
				}).catch(() => {
					uni.stopPullDownRefresh()
				})
			},
			getActiveOrder(more) {
				this.rq.getData('user_activity/get_activity_list', this.activeParams).then(res => {
					this.activeList = more ? [...this.activeList, ...res.data.data] : res.data.data
					this.total = res.data.total
					uni.stopPullDownRefresh()
				}).catch(() => {
					uni.stopPullDownRefresh()
				})
			},
			// 查看活动订单详情
			handleActivityDetail(item) {
				this.showActivityDetail = true
				this.activityId = item.id
			},
			// 查看服务订单详情
			handleOrderDetail(item) {
				this.orderId = item.id
				item.listType = 'daili'
				this.orderInfo = item
				this.orderStatus = item.status
				if (item.type == 0) {
					this.showOrderDetail = true
				} else if (item.type == 1) {
					this.showOrderDetail1 = true
				}
			},
			goPage(url) {
				// 帖子管理 跳转广场
				if (url == 'square/square') {
					uni.switchTab({
						url: `/pages/${url}`
					})
				} else {
					uni.navigateTo({
						url: `/subpages/${url}`
					})
				}
			},
			handlePickerConfirm(e) {
				const selectedOption = e.value[0]; // 获取选中的选项，这里假设返回值结构如此，需根据实际文档调整
				let imagePath = '';
				let imageTxt = ''
				switch (selectedOption) {
					case '在线':
						imagePath = 'https://pw.qyang.cc/static/online.png';
						imageTxt = '在线';
						break;
					case '隐身':
						imagePath = 'https://pw.qyang.cc/static/offline.png';
						imageTxt = '隐身';
						break;
					case '休息':
						imagePath = 'https://pw.qyang.cc/static/rest.png';
						imageTxt = '休息';
						break;
					default:
						imagePath = 'https://pw.qyang.cc/static/online.png'; // 如果出现其他未预期的选项，设置一个默认图片路径
						imageTxt = '在线';
				}
				this.selectedImage = imagePath;
				this.selectedTxt = imageTxt;
				let params = {
					online: selectedOption == '在线' ? 1 : selectedOption == '休息' ? 2 : selectedOption == '隐身' ? 3 : ''
				}
				this.rq.getData('daren/update', params).then(res => {
					uni.showToast({
						title: `已${selectedOption}`,
						icon: 'none'
					})
				})
				this.show = false; // 关闭选择器，可根据实际需求确定是否关闭
			},
			selectTab(index) {
				this.isSelected = index //服务订单   活动订单
				this.start_time = ''
				this.end_time = ''
				if (index == 0) {
					this.seviceParams.page = 1
					this.getSeviceOrder()
				}
				if (index == 1) {
					this.activeParams.page = 1
					this.getActiveOrder()
				}
			},
			selectTab1(index) {
				this.isSelected1 = index
				this.seviceParams.status = this.tablist1[index].array
			},
			selectTab2(index) {
				console.log('22222');
				this.isSelected2 = index
			},
			clickActivity(item) {
				this.activeParams.activity_status = this.tablist2[item.index].id
				this.activeParams.page = 1
				this.getActiveOrder()
			},
			clickService(e) {
				this.isSelected1 = e.index
				this.seviceParams.status = e.array
				this.seviceParams.page = 1
				this.getSeviceOrder()
			},
			choosetime1(e) {
				this.start_time = e.value
				this.showTime1 = false
			},
			choosetime2(e) {
				this.end_time = e.value
				this.showTime2 = false
			},
			confirmfilter() {
				this.seviceParams.page = 1
				this.seviceParams.createtime_start = this.start_time ? this.formatDate(this.start_time) : ''
				this.seviceParams.createtime_end = this.end_time ? this.formatDate(this.end_time) : ''
				this.getSeviceOrder()
				this.show1 = false
			},
			reset() {
				this.isSelected1 = 0
				this.seviceParams.text = ''
				this.seviceParams.daren_name = ''
				this.seviceParams.user_name = ''
				this.seviceParams.status = []
				this.seviceParams.createtime_start = ''
				this.seviceParams.createtime_end = ''
				this.start_time = ''
				this.end_time = ''
				this.seviceParams.page = 1
			},
			confirmfilter1() {
				this.activeParams.page = 1
				this.activeParams.start_time = this.start_time ? this.formatDate(this.start_time) : ''
				this.activeParams.end_time = this.end_time ? this.formatDate(this.end_time) : ''
				this.getActiveOrder()
				this.show2 = false
			},
			reset1() {
				this.activeParams.title = ''
				this.activeParams.exam_status = ''
				this.activeParams.start_time = ''
				this.activeParams.end_time = ''
				this.start_time = ''
				this.end_time = ''
				this.activeParams.page = 1
			},
			handlefilter() {
				if (this.isSelected == 0) {
					this.show1 = true
				} else {
					this.show2 = true
				}
			},
			toggleDropdown() {
				console.log(111);
				this.isDropdownShow = !this.isDropdownShow; // 点击时切换下拉框的显示隐藏状态
			},
			changeStatus() {
				this.show = true
			},
			selectOption(option) {
				this.selectedOption = option; // 更新当前选中的选项
				this.isDropdownShow = false; // 选择后隐藏下拉框
			},
			formatDate(timestamp) {
				const date = new Date(timestamp);
				const year = date.getFullYear();
				const month = (date.getMonth() + 1).toString().padStart(2, '0');
				const day = date.getDate().toString().padStart(2, '0');

				return `${year}-${month}-${day}`;
			},
			snapupOrder() {
				uni.navigateTo({
					url: '/pages/workbench/snapuporder'
				})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.lineStatus {
		width: 76rpx;
		height: 76rpx;

		image {
			width: 100%;
			height: 100%;

		}
	}

	.animate-up {
		transition: all .5s ease-in-out;
		transform: translateY(-56rpx);
	}

	.daren_con {
		width: 100%;
		border-radius: 14px 14px 0px 0px;
		opacity: 1;
		background: #FFFEFE;
		display: flex;
		align-items: center;
		margin-top: -116rpx;
		position: relative;
	}

	.snapupOrder {
		display: flex;
		margin-top: 40rpx;
		// width: 608rpx;
		height: 56rpx;
		line-height: 56rpx;
		align-items: center;
		border-radius: 10rpx;
		margin-left: 20rpx;


		.snapupOrderCenter {
			width: 128rpx;
			text-align: center;
			background-color: #FF7681;
			color: #fff;
			font-size: 24rpx;
			border-radius: 10rpx 0 0 10rpx;
		}

		.snapupOrderList {
			width: 500rpx;
			height: 56rpx;
			overflow: hidden;
			font-size: 24rpx;
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
			background-color: #FFF6F9;
			border-radius: 0 10rpx 10rpx 0;

			.date {
				margin: 0 10rpx;
			}

			.icon {
				height: 56rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

			.swiper {
				flex: 1;
			}
		}
	}

	.addressTitle {
		color: #fff;
		height: 28rpx;
		font-size: 28rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-family: 阿里巴巴普惠体 2.0;
	}

	.refreshAddress {
		width: 250rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.dropdown {
		// display: flex;
		// flex-direction: column;
		// justify-content: center;
		background-color: #ffffff;
		width: 200rpx;
		text-align: center;
		// height: 150rpx;
		border-radius: 16rpx;
		position: absolute;
		top: 60rpx;
		left: 0;

		.dropdownTxt {
			font-size: 28rpx;
			height: 75rpx;
			line-height: 75rpx;
			border-bottom: 1px solid #ccc;
		}

		.dropdownTxt:last-child {
			border-bottom: none;
		}
	}

	.content-order {
		padding: 20rpx 25rpx 100rpx;

		.orderList {
			margin-bottom: 30rpx;
			border-radius: 10px;
			background-color: #ffffff;
			width: 100%;
			// height: 686rpx;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			position: relative;

			.con4 {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				margin: 0 auto 30rpx;
				width: 315px;

				.con4-btn {
					width: 75px;
					height: 48rpx;
					border-radius: 102px;
					opacity: 1;
					background: #F7F7F7;
					border: 1px solid #F7F7F7;
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 12px;
					font-weight: normal;
					line-height: 12px;
					text-align: center;
					letter-spacing: 0px;
					color: #333333;
					margin-left: 20rpx;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}

			.con5 {
				margin: 0 auto 30rpx;
				width: 315px;

				.con5-1 {
					width: 315px;
					height: 25px;
					border-radius: 7px;
					opacity: 1;

					background: #00BC56;
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 13px;
					font-weight: normal;
					line-height: 12px;
					letter-spacing: 0px;

					color: #FFFFFF;
					text-align: center;
					display: flex;
					align-items: center;
					justify-content: center;

					image {
						width: 28rpx;
						height: 28rpx;
						margin-right: 20rpx;
					}
				}

				.con5-11 {
					background: #FF5866;
				}

				.con5-2 {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 13px;
					font-weight: normal;
					line-height: 12px;
					letter-spacing: 0px;
					text-align: center;
					color: #FF7681;
					margin-top: 20rpx;
				}
			}

			.con3 {
				padding: 20rpx auto;

				/* 900元 */
				font-family: 阿里巴巴普惠体 2.0;
				font-weight: 500;
				font-size: 14px;

				color: #FF5866;
				margin: 20rpx 40rpx;

				.con3-text {
					font-size: 12px;
					font-weight: normal;
					line-height: 14px;
					letter-spacing: 0px;
					margin: 0 10rpx;
					color: #999999;

					.money {
						color: #333333;
						margin: 0 10rpx;
					}
				}
			}

			.con1 {
				width: 315px;
				height: 42.62%;
				border-radius: 8px;
				opacity: 1;

				background: #FFF6F9;
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 13px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;

				color: #333333;
				padding: 20rpx;
				margin: 0 auto;

				image {
					width: 12px;
					height: 12px;
					margin-right: 20rpx;
				}

				.con1-item {
					height: 40rpx;
					display: flex;
					align-items: center;

					view {
						width: 580rpx;
						white-space: nowrap;
						/* 防止文本换行 */
						overflow: hidden;
						/* 隐藏超出容器的文本 */
						text-overflow: ellipsis;
						/* 显示省略号 */
					}

					;
				}
			}

			.con2 {
				display: flex;
				align-items: center;
				padding: 20rpx 0;

				.l1 {
					width: 100%;
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 16px;
					font-weight: 500;
					line-height: 17px;
					letter-spacing: 0px;

					color: #000000;
					display: flex;
					align-items: center;
					position: relative;

					.l1-sex1 {
						display: flex;
						width: 42px;
						height: 16px;
						border-radius: 88px;
						opacity: 1;
						background: rgba(116, 220, 254, 0.2);
						margin-left: 20rpx;
						font-size: 11px;
						font-weight: 500;
						line-height: 15px;
						display: flex;
						align-items: center;
						justify-content: center;
						letter-spacing: 0px;
						color: #2BC1F1;

					}

					.l1-sex2 {
						display: flex;
						width: 42px;
						height: 16px;
						border-radius: 88px;
						opacity: 1;
						margin-left: 20rpx;
						background: rgba(253, 168, 175, 0.2);

						font-size: 11px;
						font-weight: 500;
						line-height: 15px;
						display: flex;
						align-items: center;
						justify-content: center;
						letter-spacing: 0px;
						color: #FDA8AF;

					}
				}
			}

			.status {
				position: absolute;
				right: 0;
				width: 54.64px;
				height: 24.72px;
				border-radius: 0px 8px 0px 8px;
				opacity: 1;
				font-size: 13px;
				font-weight: 500;
				line-height: 12px;
				text-align: center;
				letter-spacing: 0px;
				color: #FFFFFF;
				display: flex;
				align-items: center;
				justify-content: center;

				.status0 {
					background: #FF7681;
				}

				.status1 {
					background: #FFB72B;
				}

				.status2 {
					background: #84E28C;
				}

				.status3 {
					background: #84E28C;
				}

				.status4 {
					background: #75D4F9;
				}

				.status5 {
					background: #AE9CFE;
				}

				.status6 {
					background: #D1D1D6;
				}
			}
		}

		.activityList {
			margin-bottom: 30rpx;
			border-radius: 10px;
			background-color: #ffffff;
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			position: relative;

			.title {
				font-size: 14px;
				font-weight: 600;
				line-height: 2px;
				letter-spacing: 0px;
				color: #333333;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				padding: 10rpx 28rpx;
				position: relative;
				margin: 10rpx 0;
				width: 550rpx;
				display: flex;
				align-items: center;

				.title-tab {
					width: 50px;
					height: 40rpx;
					border-radius: 4px;
					opacity: 1;

					background: #FF7681;
					font-size: 12px;
					font-weight: normal;
					line-height: 12px;
					text-align: center;
					letter-spacing: 0px;
					color: #FFFFFF;
					margin-right: 10rpx;
					display: flex;
					align-items: center;
					justify-content: center;
				}

				.title-text {
					width: 500rpx;
					height: 40rpx;
					line-height: 40rpx;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				}
			}

			.image {
				width: 100%;
				height: 400rpx;
				position: relative;

				image {
					width: 100%;
					height: 400rpx;
				}

				.endtimes {
					color: #ffffff;
					background-color: #ff7681;
					padding: 15rpx 80rpx;
					border-radius: 50rpx;
					font-size: 28rpx;
					position: absolute;
					left: 150rpx;
					bottom: -16px;
					opacity: 1;
				}
			}

			.status {
				position: absolute;
				right: 0;
				width: 54.64px;
				height: 24.72px;
				border-radius: 0px 8px 0px 8px;
				opacity: 1;

				font-size: 13px;
				font-weight: 500;
				line-height: 12px;
				text-align: center;
				letter-spacing: 0px;
				color: #FFFFFF;
				display: flex;
				align-items: center;
				justify-content: center;

				.status0 {
					background: #84E28C;
				}

				.status1 {
					background: #AE9CFE;
				}

				.status2 {
					background: rgba(153, 153, 153, 0.1);
					color: #999999;
				}

			}

			.btn {
				right: 35%;
				position: absolute;
				width: 115px;
				height: 38px;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 99px;
				opacity: 1;
				margin-top: 445rpx;
				background: #FF7681;
				font-family: PingFang SC;
				font-size: 18px;
				font-weight: normal;
				line-height: 18px;
				letter-spacing: 0px;
				color: #FFFFFF;
				text-shadow: 0px 1px 4px rgba(108, 37, 37, 0.25);
			}

			.con {
				width: 100%;
				padding: 20rpx 0;

				.con1 {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 13px;
					font-weight: normal;
					line-height: 12px;
					letter-spacing: 0px;
					margin: 20rpx;
					color: #333333;
					display: flex;
					align-items: center;
				}

				.con2 {
					display: flex;

					.con2-img {
						width: 460rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;

						image {
							width: 21px;
							height: 21px;
							margin-right: 10rpx;
						}
					}

					.con2-text {
						font-family: PingFang SC;
						font-size: 14px;
						font-weight: normal;
						line-height: 12px;
						letter-spacing: 0px;
						color: #000000
					}
				}
			}
		}
	}

	.pop-content-detail {
		width: 100%;
		height: 80vh;
		display: flex;
		flex-direction: column;
		padding: 36rpx 0 60rpx 0;
		font-family: PingFang SC;
		font-size: 15px;
		font-weight: normal;
		line-height: 15px;
		letter-spacing: 0px;
		background-color: #F7F7F7;

		.content-title {
			text-align: center;

		}

		.content-detail {
			padding: 40rpx 0;
			flex: 1;
			overflow-y: scroll;
		}
	}

	.pop-content {
		width: 100%;
		padding: 36rpx 0 120rpx 0;
		font-family: PingFang SC;
		font-size: 15px;
		font-weight: normal;
		line-height: 15px;
		letter-spacing: 0px;
		color: #333333;

		.title {
			text-align: center;
		}

		.title-1 {
			margin: 10rpx 30rpx;
			margin-top: 30rpx;

			.input {
				width: 89.07%;
				height: 34px;
				border-radius: 8px;
				opacity: 1;
				background: #F6F6F6;
				display: flex;
				align-items: center;
				justify-content: start;
				line-height: 34px;
				padding: 0 20rpx;
				margin: 20rpx 0;
			}

			.status {
				display: flex;
				flex-wrap: wrap;
				margin: 20rpx 0;
				font-family: PingFang SC;
				font-size: 13px;
				font-weight: normal;
				line-height: 15px;
				text-align: center;
				letter-spacing: 0px;

				color: #999999;

				.status-item {
					width: 100px;
					height: 40px;
					border-radius: 8px;
					opacity: 1;
					background: #F6F6F6;
					margin: 10rpx;
					display: flex;
					align-items: center;
					justify-content: center;
				}

				.status-item.active {
					background: #ff5866;
					color: #ffffff;
				}

			}

			.time {
				font-family: PingFang SC;
				font-size: 13px;
				font-weight: normal;
				line-height: 15px;
				text-align: center;
				letter-spacing: 0px;
				color: #999999;
				display: flex;
				align-items: center;
				// justify-content: center;
				margin: 20rpx 0;

				.time1 {
					width: 145px;
					height: 40px;
					border-radius: 8px;
					opacity: 1;
					background: #F6F6F6;
					font-family: PingFang SC;
					font-size: 13px;
					font-weight: normal;
					line-height: 15px;
					text-align: center;
					letter-spacing: 0px;
					color: #999999;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-left: 10rpx;
					// margin: 0 30rpx;
				}

				.mr {
					margin-right: 66rpx;
					/* 让第一个元素靠左 */
				}
			}


		}

		.pop-bottom {
			position: absolute;
			bottom: 0;
			display: flex;
			align-items: center;
			font-family: PingFang SC;
			font-size: 15px;
			font-weight: normal;
			line-height: 15px;
			text-align: center;
			letter-spacing: 0px;
			height: 60px;
			width: 100%;
			justify-content: center;
			background: #FFFFFF;
			box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);

			.btn1 {
				width: 133px;
				height: 37px;
				border-radius: 102px;
				opacity: 1;
				background: #F7F7F7;
				border: 1px solid #F7F7F7;
				color: #333333;
				display: flex;
				align-items: center;
				justify-content: center;
				margin-right: 80rpx;
			}

			.btn2 {
				color: #ffffff;
				width: 133px;
				height: 37px;
				border-radius: 102px;
				opacity: 1;
				background: #FF5866;
				border: 1px solid #FF5866;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}

	.tabs {
		background-color: #ffffff;
		padding: 10rpx 0;

		.tabs-1 {
			display: flex;
			height: 50rpx;
			margin: 20rpx;
			align-items: center;
		}

		.tabs-2 {

			justify-content: center;
			align-items: center;
			display: flex;
			margin-right: 20rpx;
			font-family: PingFang SC;
			font-size: 28rpx;
			font-weight: normal;
			line-height: 15px;
			letter-spacing: 0px;
			color: #333333;
			padding: 5rpx 20rpx;
			border-radius: 22px;
		}

		.tabs-2.active {

			transition: all 0.3s ease;
			background: #FF7883;
			font-variation-settings: "opsz" auto;
			color: #FFFFFF;
			height: 100%;
		}

		.tabs-icon {
			position: absolute;
			right: 40rpx;
			font-size: 20px;
		}
	}

	.tab-btn {
		width: 100%;
		height: 84px;
		border-radius: 14px 14px 0px 0px;
		opacity: 1;
		background: #FFFEFE;
		display: flex;
		align-items: center;
		margin-top: -100rpx;

		.btn1 {
			z-index: 9;
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 12px;
			font-weight: normal;
			line-height: 12px;
			text-align: center;
			letter-spacing: 0px;
			color: #333333;
			flex: 1;
			flex-direction: column;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 25px;
				height: 25px;
				margin-bottom: 20rpx;
			}
		}
	}

	.content {
		width: 100%;
		// height: 342rpx;
		opacity: 1;
		background: #4E4044;
		// padding: 0 20rpx;

		.content-bg {
			width: 700rpx;
			margin-left: auto;
			margin-right: auto;
			position: relative;
			height: 458rpx;

			// 	::v-deep .right {
			// 		margin-left: 10rpx;
			// 	}
		}

		.title {
			position: relative;
			display: flex;
			font-family: PingFang SC;
			font-size: 28rpx;
			font-weight: normal;
			line-height: 28rpx;
			display: flex;
			align-items: center;
			letter-spacing: 0px;
			color: rgba(255, 255, 255, 0.96);
			// margin: 0 10rpx;
		}

		.number {
			display: flex;
			flex-direction: column;
			justify-content: center;
			// height: 200rpx;
			// grid-template-columns: repeat(4, 1fr);
			// /* 定义4列，每列宽度相等，占满父容器宽度 */
			// grid-template-rows: repeat(2, auto);
			// /* 定义2行，每行高度根据子元素内容自适应 */
			grid-gap: 20rpx;
			font-family: 阿里巴巴普惠体;
			font-size: 24rpx;
			font-weight: normal;
			line-height: 28rpx;
			letter-spacing: 0px;
			color: rgba(255, 255, 255, 0.6);
			margin: 26rpx 0 28rpx;

			.number-box {
				display: flex;
				justify-content: space-around;
			}

			.number-item {
				text-align: center;
				width: 150rpx;

				.number-num {
					font-family: PingFang SC;
					font-size: 48rpx;
					font-weight: normal;
					line-height: 56rpx;
					letter-spacing: 0px;
					font-variation-settings: "opsz" auto;
					color: rgba(255, 255, 255, 0.96);
				}
			}
		}

		.area {
			font-family: 阿里巴巴普惠体;
			font-size: 24rpx;
			font-weight: normal;
			line-height: 28rpx;
			letter-spacing: 0px;
			color: rgba(255, 255, 255, 0.6);
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 20rpx 0;

			.area-text {
				width: 80%;
				margin: 0 10rpx;
				font-family: PingFang SC;
				font-size: 36rpx;
				font-weight: normal;
				line-height: 56rpx;
				letter-spacing: 0px;
				color: #BBE3C0;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
		}
	}

	.header {
		width: 100%;
		height: auto;
		display: table;
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: 10;

		.header-back {
			margin-left: 10rpx;
			height: 13px;
			line-height: 13px;
			position: absolute;
			left: 0;
			color: #FFFFFF;
		}

		.hearder-content {
			font-size: 16px;
			font-weight: normal;
			line-height: 28px;
			text-align: center;
			display: flex;
			align-items: center;
			letter-spacing: 0px;
			color: #FFFFFF;
		}

		.navon {
			width: 100%;
			height: auto;
			position: absolute;
			top: 0px;
			left: 0px;
			box-sizing: border-box;
			font-weight: 500;
			font-size: 36rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		}

	}

	.bottom-tabbar {
		position: fixed;
		bottom: 0;

	}

	.confirmAddress {
		z-index: 1000;
	}
</style>